@charset "utf-8";
/* -----[base]----- */
@media screen {
body {
background: #6e7878 url(bg.png);
}
}
@media all {
body {
position: relative;
margin: 0;
color: #272727;
font: 14px/24px Calibri, "Trebuchet MS", Tahoma, sans-serif;
}
a:link, a:visited {
text-decoration: none;
}
/* -----[container]----- */
#container {
width: 600px;
margin: 0 auto;
padding: 0 20px;
}
/* -----[header]----- */
#header {
position: relative;
padding: 20px 0 40px 0;
}
#header a:link, #header a:visited, #header span, #header ul li {
display: block;
}
#header a:focus {
outline: none;
}
#header h1 a:link, #header h1 a:visited, #header ul li a:link, #header ul li a:visited {
overflow: hidden;
text-indent: -9999px;
}
#header h1, #header h1 a:link, #header h1 a:visited {
width: 374px;
height: 138px;
}
#header h1 a:link, #header h1 a:visited {
background: url(logo.png) no-repeat;
}
#header h1 a:hover {
background-position: 0 -138px;
}
#header span, #header ul li a:link, #header ul li a:visited {
background: url(menu.png) no-repeat;
}
#header span {
position: absolute;
top: 10px;
right: 10px;
height: 24px;
width: 90px;
line-height: 22px;
text-align: center;
background-position: -367px 0;
}
#header ul, #header ul li {
margin: 0;
padding: 0;
}
#header ul {
width: 378px;
height: 27px;
margin: 0 auto;
}
#header ul li {
float: left;
list-style: none;
}
#header ul li a:link, #header ul li a:visited {
height: 27px;
margin: 0 8px 0 0;
}
#header ul li.web-site a:link, #header ul li.web-site a:visited {
width: 87px;
}
#header ul li.web-site a:hover, #header ul li.web-site a:focus {
background-position: 0 -27px;
}
#header ul li.downloads a:link, #header ul li.downloads a:visited {
width: 84px;
background-position: -87px 0;
}
#header ul li.downloads a:hover, #header ul li.downloads a:focus {
background-position: -87px -27px;
}
#header ul li.documentation a:link, #header ul li.documentation a:visited {
width: 137px;
background-position: -171px 0;
}
#header ul li.documentation a:hover, #header ul li.documentation a:focus {
background-position: -171px -27px;
}
#header ul li.svn a:link, #header ul li.svn a:visited {
width: 46px;
margin: 0;
background-position: -308px 0;
}
#header ul li.svn a:hover, #header ul li.svn a:focus {
background-position: -308px -27px;
}
/* -----[content]----- */
#content a:link, #content a:visited {
border-bottom-width: 1px;
border-bottom-style: solid;
}
#content a:link {
color: #ffd200;
border-bottom-color: #ffd201;
}
#content a:visited {
color: #ebd672;
border-bottom-color: #ebd673;
}
#content a:hover {
color: #2899ee;
border-bottom-color: #2899ef;
}
#content h2, #content pre, #content p, #content ol, #content li, #content .example button {
margin: 0;
padding: 0;
}
#content p {
padding: 14px;
border: 1px solid #cc9f5a;
}
#content .example, #content .example div {
position: relative;
}
#content .example, #content p {
margin-bottom: 40px;
}
#content .example h2, #content .example div code.tag span.active, #content .example div code.text span.active, #content .example label, #content .example ol, #content p {
color: #fff;
}
#content .example h2, #content .example ol, #content p {
background: url(dark.png) no-repeat;
}
#content .example h2 {
padding: 0 24px;
font-size: 18px;
line-height: 36px;
font-variant: small-caps;
letter-spacing: 1px;
}
#content .example button, #content .example label {
position: absolute;
display: block;
}
#content .example button {
top: 6px;
right: 6px;
height: 24px;
width: 60px;
padding-bottom: 3px;
color: #c6ccd3;
font-size: 12px;
line-height: 24px;
text-align: center;
border: 1px solid #000;
background: #404449;
cursor: pointer;
}
#content .example button:hover, #content .example button:focus {
background: #0b66ab;
}
#content .example button:active {
background: #0a568f;
}
#content .example div {
margin-top: 30px;
padding: 7px 0 7px 7px;
border: 1px solid #303838;
background: #eee;
}
#content .example div.result pre {
white-space: pre-wrap;
}
#content .example div.dom {
width: 191px;
float: right;
}
#content .example div.code, #content .example ol {
margin-right: 224px;
}
#content .example div code {
display: block;
font: 12px/20px Consolas, "Courier New", Courier, monospace;
}
#content .example div pre code {
display: inline;
color: #03366a;
}
#content .example div code.tag {
color: #0b72bf;
}
#content .example div code.text {
color: #66990a;
}
#content .example div code code {
padding-left: 15px;
border-left: 1px dotted #3b3b3b;
}
#content .example div code.tag span.active {
background: #0b72bf;
}
#content .example div code.text span.active {
background: #85b53d;
}
#content .example div pre code.active {
background: #fc0;
}
#content .example label {
top: -20px;
left: 2px;
height: 20px;
padding: 0 7px;
font-size: 11px;
line-height: 20px;
background: #323838;
}
#content .example ol {
padding-left: 24px;
}
#content .example ol li {
display: none;
}
/* -----[footer]----- */
#footer {
margin-bottom: 40px;
text-align: center;
}
#footer .vcard {
padding: 4px;
font: 10px/20px Verdana, sans-serif;
background: #929292;
}
#footer a:link, #footer a:visited {
padding: 1px;
color: #272727;
border: none;
}
#footer a:hover {
background: #fc0;
}
/* -----[tooltip]----- */
.tooltip {
position: absolute;
top: 82px;
left: 0;
height: 66px;
width: 180px;
padding: 10px 10px 40px;
color: #fff;
font-size: 12px;
background: url(tooltip.png) no-repeat;
}
/* -----[clearfix]----- */
#content .example {
height: 1%;
overflow: hidden;
}
/* -----[advanced]----- */
#content .example .active {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
-khtml-border-radius: 2px;
border-radius: 2px;
}
#content .example button, #footer .vcard {
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-khtml-border-radius: 3px;
border-radius: 3px;
}
#content .example h2, #content .example div, #content .example label, #content .example ol, #content p {
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-khtml-border-radius: 5px;
border-radius: 5px;
}
#content .example h2 {
text-shadow: 1px 1px 0 #000;
}
#content .example label {
-moz-border-radius: 5px 5px 0 0;
}
#header span {
text-shadow: 1px 1px 0 #969a9a;
}
::selection {
color: #272727;
background: #fc0;
}
::-moz-selection {
color: #272727;
background: #fc0;
}
}
@media print {
a:link:after, a:visited:after {
content: " (" attr(href) ")";
}
}